/* 
 * To change this template, choose Tools | Templates
 * and open the template in the editor.
 */

//
//themeCode:主题编码
//theme:主题
//mainPointId:焦点监测点
function ConnectPanel(themeCode,theme,mainPointId,mainPointName){
    this.addRateSeries = function (s, ri, r) {
        this.pointName = r.get('name');
        this.pointId = r.get('id');
       
        if (this.charts.series.length > 5) {
            Ext.Msg.alert('系统提示', '最多只能添加5个监测点');
            s.deselectRow(ri);
            return;
        }
        this.charts.addSeries({
            name: pointName,
            id: mainPointId + pointId,            
            data: []
        });
        this.charts.series[this.charts.series.length-1].pointId = pointId;
        requestDayData(this.charts, this.charts.series.length-1, mainPointId,pointId,'date');
    };

    this.removeRateSeries=function (s, ri, r) {        
        var pointId = r.get('id');
        var theSeries = charts.get(mainPointId + pointId);
        if (theSeries !== null)
            theSeries.remove();
    };

    this.stores = createConnectPointStore();
    this.chartPanel = new Ext.Panel({
        width: '70%',
        region: 'center',
        html: '<div id= "chart'+themeCode + mainPointId + '" style="min-width: 200px; min-height: 400px; margin: 0 auto"></div>'
    });
    this.checkboxSelSuperior = new Ext.grid.CheckboxSelectionModel();
    this.checkboxSelSuperior.on("rowselect", this.addRateSeries);
    this.checkboxSelSuperior.on("rowdeselect", this.removeRateSeries);
    this.superiorPointPanel = new Ext.grid.GridPanel({
        sm: this.checkboxSelSuperior,
        autoExpandColumn: 'SuperiorName',
        store: this.stores.storeSuperior,
        columns: [
            this.checkboxSelSuperior,
            {header: "ID", sortable: true, dataIndex: "id", hidden: true},
            {header: '监测点名称', id: 'SuperiorName', width: 100, sortable: true, dataIndex: 'name'}
        ],
        loadMask: true
    });


    this.checkboxSelJunior = new Ext.grid.CheckboxSelectionModel();
    this.checkboxSelJunior.on("rowselect", this.addRateSeries);
    this.checkboxSelJunior.on("rowdeselect", this.removeRateSeries);
    this.juniorPointPanel = new Ext.grid.GridPanel({
        sm: this.checkboxSelJunior,
        store: this.stores.storeJunior,
        autoExpandColumn: 'JuniorName',
        columns: [
            this.checkboxSelJunior,
            {header: "ID", sortable: true, dataIndex: "id", hidden: true},
            {header: '监测点名称', id: 'JuniorName', width: 100, sortable: true, dataIndex: 'name'}
        ],
        loadMask: true
    });

    this.checkboxSelSibling = new Ext.grid.CheckboxSelectionModel();
    this.checkboxSelSibling.on("rowselect", this.addRateSeries);
    this.checkboxSelSibling.on("rowdeselect", this.removeRateSeries);
    this.siblingPointPanel = new Ext.grid.GridPanel({
        sm: this.checkboxSelSibling,
        store: this.stores.storeSibling,
        autoExpandColumn: 'SiblingName',
        columns: [
            this.checkboxSelSibling,
            {header: "ID", sortable: true, dataIndex: "id", hidden: true},
            {header: '监测点名称', id: 'SiblingName', width: 100, sortable: true, dataIndex: 'name'}
        ],
        loadMask: true
    });
    this.eastConnectPointPanel = new Ext.TabPanel({
        width: '30%',
        region: 'east',
        items: [
            {title: '上级监测点', layout: 'fit', items: [this.superiorPointPanel]},
            {title: '下级监测点', layout: 'fit', items: [this.juniorPointPanel]},
            {title: '同级级监测点', layout: 'fit', items: [this.siblingPointPanel]}
        ],
        activeTab: 0
    });
    this.panelAll = {
        title: mainPointName+theme,
        closable: true,
        id: 'a'+themeCode + mainPointId,
        layout: 'border',
        tbar: [
            {
                xtype: 'datefield',
                id: 'DateFrom'+theme + mainPointId,
                format: 'Y年m月d日',
                style: {marginLeft: '10px'},
                width: 150,
                value: now.add(Date.DAY, -15)
            },
            {
                xtype: 'datefield',
                id: 'DateTo'+theme + mainPointId,
                format: 'Y年m月d日',
                style: {marginLeft: '20px'},
                width: 150,
                value: now
            },
            {
                xtype: 'button',
                text: '刷新',
                iconCls: 'icon-refresh',
                width: 60,
                style: {marginLeft: '20px'},
                handler: function() {
                    var dateFrom = Ext.getCmp('DateFrom'+themeCode + mainPointId).getValue();
                    var dateTo = Ext.getCmp('DateTo'+themeCode + mainPointId).getValue();
                    this.charts.xAxis[0].setCategories(createDayCategoryArray(dateFrom, dateTo));                   
                    for(var i=0;i<this.charts.series.length;i++){
                        requestDayData(this.charts, i, this.mainPointId,this.charts.series[i].pointId,'date');
                    }
                }
            }
        ],
        items: [this.chartPanel, this.eastConnectPointPanel]
    };
    
    /*this.charts = new Highcharts.Chart({
        chart: {
            //renderTo: 'chart'+themeCode + mainPointId,
            renderTo:'chartmonth75',
            type: 'spline'
        },
        title: {
            text: theme
        },
        credits: {
            enabled: false
        },
        colors: [
            '#000000', //黑  
            '#FF0000', //红  
            '#00FF00', //绿  
            '#0000FF', //蓝  
            '#FFFF00', //黄  
            '#FF00FF', //紫  
            '#00FFFF'//  
        ],
        xAxis: {
            title: {
                text: '日期'
            }
        },
        yAxis: {
            title: {
                text: '合格率(%)'
            },
            ceiling:102,
            floor:50
            
        },
        series: [{
                name: mainPointName,                
                data: []
            }
        ]
    });    
    var dateFrom = Ext.getCmp('DateFrom'+themeCode + mainPointId).getValue();
    var dateTo = Ext.getCmp('DateTo'+themeCode + mainPointId).getValue();
    this.charts.xAxis[0].setCategories(createDayCategoryArray(dateFrom, dateTo));
    this.charts.series[0].pointId = mainPointId;
    requestDayData(this.charts, 0, mainPointId,mainPointId,themeCode);*/
}
